<template>
  <div class="pageList">
    <div style="display: flex; width: 100%;">
      <div style="width: 20%;border-right: 1px solid #C0C4CC;padding-right: 10px;">
        <el-input
          placeholder="输入关键字进行过滤"
          v-model="filterText">
        </el-input>
        <el-tree
          class="filter-tree"
          :data="treeData"
          :props="defaultProps"
          default-expand-all
          :filter-node-method="filterNode"
          @node-click="handleClickNode"
          ref="tree">
        </el-tree>
      </div>
      <div style="width: 80%;">
        <TheTable
          ref="TheTableRef"
          :tableApi="systemDocumentListApi"
          :searchList="searchList"
          :listColumns="listColumns"
          :actionArr="actionArr"
          :btnList="btnList"
          :mustQuery="mustQuery"
          exportUrl='/jsjx/userDocument/export'
          exportName="文档管理"
          @handleClick="handleClick"
        />
      </div>
    </div>
    <TheDetail ref="TheDetailRef" @refresh="setTableList()"/>
  </div>
</template>
<script>
import TheTable from '@/componentsView/TheTable.vue';
import TheDetail from './TheDetail.vue';
import { searchList, listColumns, actionArr, btnList, formFields, formRules} from './data'
import { systemDocumentListApi, systemDocumentDelApi } from '@/api/system/document'
import { documentShareAddApi, documentShareCancelApi } from '@/api/share/index'
import { useDict } from '@/utils/dict//useDict'
export default {
  name: 'DocumentManage',
  components: { TheTable, TheDetail },
  data() {
    return {
      searchList,
      listColumns,
      actionArr,
      btnList,
      formFields,
      formRules,
      systemDocumentListApi,
      mustQuery:{},
      filterText:'',
      dialogVisible: false,
      formData: {},
      treeData: [],
      document_type:useDict('document_type'),
      defaultProps: {
        children: 'children',
        label: 'label'
      },
      wordId: this.$route.query.wordId,
    }
  },
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val);
    },
    document_type(val) {
      this.setDocumentFun()
    }
  },
  created() {
    this.setDocumentFun()
  },
  methods: {
    setTableList(){
      this.$refs.TheTableRef.resetQuery()
    },
    setDocumentFun(){
      this.treeData = this.document_type.map(node => this.transformNode(node));
    },

    // 递归处理函数
    transformNode(node) {
      // 创建新对象，只包含需要的属性
      const newNode = {
        label: node.dictLabel,
        id: node.dictCode
      };
      // 如果有子节点，递归处理子节点
      if (node.children && node.children.length) {
        newNode.children = node.children.map(child => this.transformNode(child));
      }
      return newNode;
    },
    handleClick({action, record}) {
      switch(action) {
        case 'add':
          this.$refs.TheDetailRef.handleOpen(action, { treeData: this.treeData });
          break;
        case 'edit':
          this.$refs.TheDetailRef.handleOpen(action, { wordId: record.wordId, treeData: this.treeData });
          break;
        case 'del':
          this.$confirm('此操作将永久删除该文件, 是否继续?', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            this.systemDocumentDelFun(record.wordId);
          }).catch(() => {
            this.$message.info('已取消删除');
          });
          break;
        case 'look':
          this.$refs.TheDetailRef.handleOpen(action, { wordId: record.wordId, treeData: this.treeData });
          break;
        case 'share':
          this.documentShareFun(action, { wordId:record.wordId, deptId:record.collageId });
          break;
        case 'cancelShare':
          this.documentShareFun(action, { wordId:record.wordId });
          break;
        default:
      }
    },

    // 删除文档操作
    systemDocumentDelFun(id){
      systemDocumentDelApi(id).then(res=>{
        if (res.code === 200) {
          this.$message.success(res.msg)
          this.setTableList()
        } else {
          this.$message.error(res.msg)
        }
      })
    },
    // 分享和取消文档操作
    documentShareFun(action, params){
      const api = action === 'share' ? documentShareAddApi : documentShareCancelApi
      api(params).then(res=>{
        if (res.code === 200) {
          this.$message.success(res.msg)
          this.setTableList()
        } else {
          this.$message.error(res.msg)
        }
      })
    },

    filterNode(value, data) {
      if (!value) return true;
      return data.label.indexOf(value) !== -1;
    },

    // 点击tree节点获取id和名称
    handleClickNode(data,node){
      this.mustQuery.categoryId = data.id;
      this.setTableList()
    },

    // 递归获取节点路径
    getNodePath(node) {
      const path = [];
      // 从当前节点向上遍历所有父节点
      while (node) {
        path.unshift(node.label);
        node = node.parent;
      }
      // 直接用join('/')拼接即可，不会产生前置斜杠
      return path.join('/').replace(/^\//, '');
    },
  }
}
</script>
<style scoped lang="scss">
.filter-tree{
  margin-top: 10px;
}
</style>